<script setup lang="ts">
import { computed } from 'vue';
import { useAppStore } from '@/store/modules/app';
import HeaderBanner from './modules/header-banner.vue';
import CardData from './modules/card-data.vue';
import LineChart from './modules/line-chart.vue';
import PieChart from './modules/pie-chart.vue';
import ProjectNews from './modules/project-news.vue';
import CreativityBanner from './modules/creativity-banner.vue';
import { $t } from '@/locales';

const appStore = useAppStore();

const gap = computed(() => (appStore.isMobile ? 0 : 16));
</script>

<template>
  <div class="home-container h-100%">
    <div class="top-banner">
      <img src="@/assets/imgs/home/home-bg.png" alt="">
      <div class="welcome">欢迎进入 {{ $t('system.title') }}!</div>
    </div>
  </div>
</template>

<style scoped lang="scss">
.home-container{
  background: #fff;
  .top-banner{
    position: relative;
    .welcome{
      position: absolute;
      top: 20px;
      left: 20px;
      color: #fff;
      font-size: 40px;
    }
  }
}
</style>
